<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>个人技术博客</title>
<style type="text/css">
/*
#3399CC
#336699
#FFFFFF
#99CCCC
#FFFFCC
*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, article, aside, details, figcaption, figure, #footer, #header, hgroup, menu, nav, section {
	margin: 0;
	padding: 0;
}
html, body {
	color: #636363;
	background-color: #f2f2f2;
}
body::-webkit-scrollbar {
 width:8px;
 height:8px;
 background:#CCC;
 border-radius:5px;
}
body::-webkit-scrollbar-button {
 display:none;
}
body::-webkit-scrollbar-track-piece {
 display:none;
}
body::-webkit-scrollbar-thumb {
 background:#999;
 border-radius:5px;
}
a {
	cursor: pointer;
	transition: all 0.30s ease-in-out;
	-webkit-transition: all 0.30s ease-in-out;
	-moz-transition: all 0.30s ease-in-out;
}
body, input, button, textarea, select {
	font-family: "Lantinghei SC", "Open Sans", Arial, "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", "STHeiti", "WenQuanYi Micro Hei", SimSun, sans-serif;
}
#example {
	max-width: 640px;
	min-width: 320px;
	height: 200px;
	margin: 0 auto;
	background: #3399CC; /* #336699 */
	color: #FFFFCC; /* #FFFFFF */
	text-align: center;
	line-height: 2em;
	padding-top: 100px;
	overflow-x: hidden;
}
#example .p1 {
	font-size: 22px;
}
#example .p2 {
	color: #FFFFFF;
}
#example .p3 {
	display: inline-block;
	padding: 5px 20px;
	background: #99CCCC;
	color: #FFFFCC;
}
</style>
</head>

<body>
<div id="example">
  <p class="p1">个人技术博客网页配色</p>
  <p class="p2"></p>
  <p class="p3">技术博客</p>
</div>
</body>
</html>
